<template>
    <div style="text-align:center;min-width:1100px">
        <Row style="margin-bottom:10px">
            <Col span="5">
                <label>需求状态：</label>
                <Select v-model="page.action_data.status" style="width:150px;" @on-change="changeStatus" >
                    <Option v-for="item in Lists" :value="item.index" :key="item.index"  >{{ item.title }}</Option>
                </Select>
            </Col>
             <Col span="16">
                <label>需求编号：</label>
                <Input v-model="page.action_data.number" style="width:200px"></Input>
                <label>需求名称：</label>
                <Input v-model="page.action_data.name" style="width:200px"></Input>
                <Button type="primary" icon="ios-search" @click="search" >搜索</Button>
                <Button type="primary"  @click="allInfo" >全部信息</Button>
                <Button type="ghost" @click="exportData">导出信息</Button>
            </Col>
             <Col span="3">
                <Button type="primary" @click="$router.push({ name:'post_demand_project' })">发布需求</Button>
            </Col>
        </Row>
        <Table border stripe :columns="columns1" :data="list" ref="table"></Table>
        <AutoPage v-model="page"></AutoPage>
    </div>
</template>
<script>
import Page from '@/common/model/Page'
import AutoPage from '@/common/components/AutoPage'
import Demand from '@/common/model/Demand'
import Demandprogress from '../main-components/progress'

export default {
    data(){
        return {
            page: new Page("demand/page",{status:6,name:''}),
            status:{
                    type:'info',
                    message:'草稿箱'
                },
            statusList:6,
            columns1: [
                {
                   title:'序号',
                    type:'index',
                    align:'center',
                    width: 75
                },
                {
                    title: '编号', 
                    key: 'number',
                    render:(h, params) => {
                        return h('div', params.row.number);
                    }
                },
                {
                    title: '需求名称',
                    key: 'title'
                },
                {
                     title: '添加时间',
                     sortable: true,
                    key: 'format_create_time',
                    render: (h, params) => { 
                        return h('strong',  params.row.format_create_time);
                }},
                {
                        title: '状态',
                        key: 'status',
                        width: 150,
                        align: 'center',
                        render: (h, params) => {
                            var status = this.formatStatus(params.row);
                            return h('Button', {
                                  props: {
                                        type: status.type,
                                        size: 'small'
                                    },
                                    on:{
                                        click:()=>{
                                            this.page.action_data.status = params.row.status;
                                            this.page.current_page = 1;
                                            this.page.getData();
                                        }
                                    }
                                }, status.message)
                        }
                },
                {
                        title: '操作',
                        key: 'action',
                        width: 300,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                 h('Button', {
                                    props: {
                                        type: 'info',
                                        size: 'small'
                                    },
                                    style:{
                                          marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.handleDetail(params.row)
                                        }
                                    }
                                }, '详情'),
                                h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                           this.handleEdit(params.row)
                                        }
                                    }
                                }, '修改'),
                                h('Button', {
                                    props: {
                                        type: 'warning',
                                        size: 'small'
                                    },
                                     style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.handleDelete(params.row)
                                        }
                                    }
                                }, '删除'),
                                 h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    on: {
                                        click: () => {
                                            this.handleRecycle(params.row)
                                        }
                                    }
                                }, '回收')
                            ]);
                        }
                }
            ],
            Lists:[
                 {
                    index:6,
                    title:'全部状态'
                },
                {
                    index:0,
                    title:'草稿箱'
                },
                {
                    index:1,
                    title:'审核中'
                },
                {
                     index:2,
                    title:'已发布'
                },
                {
                     index:3,
                    title:'审核未通过'
                },
                {
                     index:4,
                    title:'已回收'
                },
                
            ],
            // statusSelect:"全部状态"
        };
    },
    computed: {
        list() {
            return Demand.parseList(this.page.list);
        }
    },
    components: {
        AutoPage,
        Demandprogress,
        
    },
    methods: {
            allInfo(){
                this.page.current_page = 1;
                this.page.action_data.status = 6;
                this.page.action_data.name = '';
                this.page.action_data.number = '';
                this.page.getData();        
            },
            search(){
                this.page.current_page = 1;
                this.page.getData();       
            },
            handleDetail(element){
                this.$router.push({
                    name:'post_demand_project',query:{id:element.id,detail:1}
                });
            },
            handleEdit(element) {
                if(element.status == 1) {
                    this.$CustomMessage.error('已经提交审核不能修改！');  
                    return false;
                }else if(element.status == 2) {
                    this.$CustomMessage.error('已发布不能进行修改!'); 
                    return false;
                }else if(element.status == 4) {
                    this.$CustomMessage.error('已回收不能进行修改!');  
                    return false;
                }else {
                    this.$router.push({
                        name: 'post_demand_project', query:{ id: element.id, detail: 0 }
                    });
                }
            },
            handleDelete(element){
                if(!confirm("删除后信息不能被恢复，是否删除吗?")) return;
                else if(element.status == 1){
                     this.$CustomMessage.error('已经提交审核不能删除！');
                     return false;
                }else if(element.status == 2){
                    this.$CustomMessage.error('已经发布不能删除！');
                    return false;
                }else if(element.status == 4){
                    this.$CustomMessage.error('已经回收过的不能删除！');
                    return false;
                }
                else if(element.id && element.status == 0) {
                    this.api.post( "demand/delete", { id: element.id }, res => {
                        if(res==""){
                            this.$CustomMessage.error('删除不成功！');
                        }else{
                            this.$CustomMessage.success('删除成功！');  
                            this.page.getData();  
                        } 
                    });
                }else{
                        this.$CustomMessage.error('删除失败！');  
                }
            },
            handleRecycle(element){
                 if(!confirm("回收后网站上的信息同样也会被回收，是否回收吗?")) return;
                 else if(element.status == 1){
                    this.$CustomMessage.error('已经提交审核不能回收！');
                    return false;
                } else if(element.status == 4){
                    this.$CustomMessage.error('已经回收不能重复回收！');
                    return false;
                } else if(element.id){
                    this.api.post( "demand/recycle", { id: element.id }, res => {
                        this.$CustomMessage.success('回收成功！');
                        this.page.getData();
                    });
                }
            },
            formatStatus(element){
                var status = { type: "", message: "" };
                if(element.status == 0){
                    status.type = "primary"
                    status.message = "草稿箱";
                } else if(element.status == 1){
                    status.type = "info"
                    status.message = "审核中";
                } else if(element.status == 2){
                    status.type = "success"
                    status.message = "已发布"
                } else if(element.status == 3) {
                    status.type = "error"
                    status.message = "审核未通过"
                } else if(element.status== 4) {
                    status.type = "warning"
                    status.message = "已回收"
                }
                return status;
            },
            changeStatus(){
                this.page.current_page = 1;
                this.page.getData();        
            },
            exportData(){
               this.page.exportExcel();
            }
        },
        created(){
        }
    }
</script>